<!-- 顶部悬浮搜索栏 -->
<div id="top_search">
    <section>
        <a href="" class="title">
            <h1>蘑菇街</h1>
            <img src="img/MoGuJie.png" alt="">
        </a>
        <div class="search-bar">
            <form action="">
                <input type="search" placeholder="口红">
                <input type="submit" value="">
            </form>
        </div>
        <a href="">
            <span>消息</span>
        </a>
        <a href="">
            <span>收藏</span>
        </a>
        <a href="cart.html">
            <span>购物车</span>
        </a>

        <a href="login&register.html">
            <img src="img/login.png" alt="">
            <p>登录</p>
            <span></span>
        </a>
        <ul class="top_usermenu">
            <li>
                <p>我的订单</p>
            </li>
            <li>
                <p>个人设置</p>
            </li>
            <li>
                <p>退出</p>
            </li>
        </ul>
    </section>
</div>



<!-- 导航栏 -->
<header>
    <section>
        <ul>
            <li>
                <a href="index.html">
                    <img src="img/home.png" alt=""> 首页
                </a>
            </li>
            <li>
                <a href="">
                    <img src="img/market.png" alt=""> 商城
                </a>
            </li>
            <li>
                <a href="">
                    我的订单
                </a>
            </li>
            <li>
                <a href="">
                    关于我们 <img src="img/downarrow.png" alt="">
                </a>
                <div class="aboutUs">
                    <div class="top">
                        <div>
                            <p>新手帮助</p>
                            <span></span>
                            <ul>
                                <li>
                                    <a href="">常见问题</a>
                                </li>
                                <li>
                                    <a href="">自助服务</a>
                                </li>
                                <li>
                                    <a href="">联系客服</a>
                                </li>
                                <li>
                                    <a href="">意见反馈</a>
                                </li>
                            </ul>
                        </div>
                        <div>
                            <p>权益保障</p>
                            <span></span>
                            <ul>
                                <li>全国包邮</li>
                                <li>7天无理由退货</li>
                                <li>退货运费补贴</li>
                                <li>限时发货</li>
                            </ul>
                        </div>
                        <div>
                            <p>支付方式</p>
                            <span></span>
                            <ul>
                                <li>微信支付</li>
                                <li>支付宝</li>
                                <li>白付美支付</li>
                            </ul>
                        </div>
                        <div>
                            <P>移动客户端下载</P>
                            <span></span>
                            <ul>
                                <li>
                                    蘑菇街
                                    <img src="https://s10.mogucdn.com/mlcdn/c45406/190221_3l1eje914h3h6ch88ce2l6eh0jl17_260x260.png"
                                         alt="">
                                </li>
                                <li>
                                    美丽说
                                    <img src="https://s10.mogucdn.com/mlcdn/c45406/190221_60dd5ic9e009acbjb005c8c2k8k89_260x260.png"
                                         alt="">
                                </li>
                                <li>
                                    uni引力
                                    <img src="https://s10.mogucdn.com/mlcdn/c45406/181029_1e2kfd9la7jg28063eleikgj3k033_158x144.png"
                                         alt="">
                                </li>
                            </ul>
                        </div>
                        <div>
                            <P>商家服务</P>
                            <span></span>
                            <ul>
                                <li>
                                    <a href="">商家入驻</a>
                                </li>
                                <li>
                                    <a href="">蘑菇街商学院</a>
                                </li>
                                <li>
                                    <a href="">商家社区</a>
                                </li>
                                <li>
                                    <a href="">规则中心</a>
                                </li>
                                <li>
                                    <a href="">规则众议院</a>
                                </li>
                            </ul>
                        </div>
                        <div>
                            <P>关于我们</P>
                            <span></span>
                            <ul>
                                <li>
                                    <a href="">招聘信息</a>
                                </li>
                                <li>
                                    <a href="">联系我们</a>
                                </li>
                                <li>
                                    <a href="">有害信息举报</a>
                                </li>
                                <li>
                                    <a href="">用户隐私保护</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="bottom">
                        <p>©2019 Mogu.com 杭州卷瓜网络有限公司</p>
                        <p>
                            营业执照：<a
                                href="">913301065526808764</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;增值电信业务经营许可证：<a
                                href="">浙B2-20110349</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a
                                href="">安全责任书</a>&nbsp;&nbsp;&nbsp;|
                        </p>
                        <p>
                            浙公网安备 33010602010221号&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a
                                href="">互联网医药信息服务资格证书编号：(浙)-经营性-2018-0002</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a
                                href="">浙网食A33010003</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a
                                href="">出版物网络交易平台服务经营备案证</a>&nbsp;&nbsp;&nbsp;|
                        </p>
                        <p>
                            <a href="">(浙)网械平台备字[2018]第00006号</a>&nbsp;&nbsp;&nbsp;|
                        </p>
                        <p>联系电话：400-8158-666（在线时间：09：00-22：00）浙江省杭州市西湖区古墩路99号浙商财富中心1号楼</p>
                    </div>
                </div>
            </li>
        </ul>
    </section>
</header>



<!-- 搜索栏 -->
<div id="search">
    <a href="">
        <h1>蘑菇街</h1>
        <img src="img/MoGuJie.png" alt="">
    </a>
    <section>
        <div class="category">
            <img src="img/category.png" alt="">
            目录
            <article>
                <div class="left">
                    <span>主题市场</span>
                    <ul class="theme_list">

                    </ul>
                </div>
                <div class="center">
                    <span>热门品牌</span>
                    <a href="" class="total">全部品牌&gt;</a>
                    <ul class="hot_list">

                    </ul>
                </div>
                <div class="right">
                    <span>流行话题</span>
                    <a href="" class="total">全部话题&gt;</a>
                    <ul class="popular_list">

                    </ul>
                </div>
            </article>
        </div>
        <div class="search-bar">
            <form action="">
                <input type="text" v-model="titleOrTypeName">
                <button @click.stop="selectShop()">搜&nbsp;&nbsp;索</button>
            </form>
        </div>
        <a href="">
            <span>消息</span>
        </a>
        <a href="">
            <span>收藏</span>
        </a>
        <a href="cart.html">
            <span>购物车</span>
        </a>
        <a href="">
                <span>
                    &nbsp;&nbsp;&nbsp;APP
                    <div class="appCode"></div>
                </span>
        </a>
        <a href="login&register.html">
            <img src="img/login.png" alt="">
            <p>登录</p>
            <span></span>
        </a>
        <ul class="usermenu">
            <li>
                <p>我的订单</p>
            </li>
            <li>
                <p>个人设置</p>
            </li>
            <li>
                <p>退出</p>
            </li>
        </ul>
    </section>
</div>